<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>验证码</title>
		<meta name="keywords" content="验证码">
		<meta name="description" content="验证码">
		<%@ include file="public/head.jspf"%>
	</head>
	<body>
		<div class="box">
			<h1>验证码系统<a class="back">返回</a></h1>
			<div class="content">
				<div id="data">
					<table id="datalist">
						<tr>
							<th>类型</th>
							<th>验证码</th>
							<th>更换</th>
						</tr>
						<tr>
							<td>默认</td>
							<td><img id="img" src="basecode.do" /></td>
							<td><a href="#">换一张</a></td>
						</tr>
						<tr>
							<td>数字</td>
							<td><img id="img1" src="numcode.do" /></td>
							<td><a href="#">换一张</a></td>
						</tr>
						<tr>
							<td>字母</td>
							<td><img id="img2" src="engcode.do" /></td>
							<td><a href="#">换一张</a></td>
						</tr>
						<tr>
							<td>字母+数字</td>
							<td><img id="img3" src="enumcode.do" /></td>
							<td><a href="#">换一张</a></td>
						</tr>
						<tr>
							<td>汉字</td>
							<td><img id="img4" src="chncode.do" /></td>
							<td><a href="#">换一张</a></td>
						</tr>
					</table>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			$("#datalist").find("img").each(function() {
				var id = "#" + $(this).attr("id");
				var src = $(this).attr("src");
				var change = $(this).parent().next().children();
				var clickstr = "$('" + id + "').attr('src','" + src + "?" + Math.random() + "')";
				$(this).attr("onclick", "$(this).attr('src',src+'?'+Math.random())");
				change.attr("onclick", clickstr);
			});
		</script>
	</body>
</html>